<template>
	<sysJk :label="(examType==1?'7':'9')+'.消防联动控制器直接手动控制单元操作'" showBack :withoutTop="true" :leftTime="120">
		<template v-slot:content>
			<view class="warp" id="warp" @touchmove.stop="()=>{}">
				<template v-if="examType==1">
					<view class="taskTit" style="text-align: left;width:100%;font-size: 2.5vh;" v-if="showQuestion==1">
						【1/2】请通过多线盘，手动启动消防水泵，并判断设备启动状态
					</view>
					<view class="taskTit" style="text-align: left;width:100%;font-size: 2.5vh;" v-else>
						【2/2】请通过多线盘，手动启动排烟风机，并判断设备启动状态
					</view>
				</template>
				<template v-else>
					<view class="taskTit" style="text-align: left;width:100%;font-size: 2.5vh;" v-if="showQuestion==1">
						【1/1】请通过多线盘，手动启动消防水泵，并判断设备启动状态
					</view>
				</template>
				<view class="innerContent" style="position:relative;width:100%;height:100%;">
					<image :src="bUrl" style="width:100%;height:100%;display: block;"></image>
					<view class="myCard" id="myCard">
						<view class="cardContent">
							<image v-if="picIndex==3&&handleByAutoFlag" class="maskLight" style="position: absolute;"
								:src="requestUrl+'/static/image/green.png'"
								:style="{left:425*widthBl+'px',top:355*heightBl+'px',width:30*widthBl+'px',height:30*heightBl+'px'}">
							</image>
							<image v-if="picIndex==3&&!handleByAutoFlag" class="maskLight" style="position: absolute;"
								:src="requestUrl+'/static/image/back.png'"
								:style="{left:425*widthBl+'px',top:355*heightBl+'px',width:30*widthBl+'px',height:30*heightBl+'px'}">
							</image>
							<image v-if="picIndex==3&&handleBySelfFlag" class="maskLight" style="position: absolute;"
								:src="requestUrl+'/static/image/green.png'"
								:style="{left:425*widthBl+'px',top:390*heightBl+'px',width:30*widthBl+'px',height:30*heightBl+'px'}">
							</image>
							<image v-if="picIndex==3&&!handleBySelfFlag" class="maskLight" style="position: absolute;"
								:src="requestUrl+'/static/image/back.png'"
								:style="{left:425*widthBl+'px',top:390*heightBl+'px',width:30*widthBl+'px',height:30*heightBl+'px'}">
							</image>
							<image v-if="picIndex==3&&((!isReturnFlag&&opened)||!opened)" class="backLight"
								style="position: absolute;" :src="requestUrl+'/static/image/back.png'"
								:style="{left:825*widthBl+'px',top:290*heightBl+'px',width:20*widthBl+'px',height:20*heightBl+'px'}">
							</image>
								<view class="handleBtn">
									<!-- <van-button color="#1E90FF	" custom-style="width:100rpx;height:30rpx;border-radius:10rpx;margin-right:10px" @tap="lastTask">上一题</van-button> -->
									<u-button
										:custom-style="{width:'100rpx',height:'30rpx',borderRadius:'10rpx',marginRight:'10px',background:'green',color:'#fff',fontSize:'3vh'}" v-if="examType==1" @click="showFlag=true">查看解析</u-button>
									<!-- <van-button color="#1E90FF	" custom-style="width:100rpx;height:30rpx;border-radius:10rpx;margin-right:10px" @tap="nextTask">下一题</van-button> -->
								</view>
								<view class="btnArea">
									<u-button :custom-style="{width:'100rpx',height:'30rpx',borderRadius:'10rpx',marginRight:'10px',background:'#1E90FF',color:'#fff',fontSize:'3vh'}"
										@click="handleData">提交</u-button>
									<u-button
										:custom-style="{width:'100rpx',height:'30rpx',borderRadius:'10rpx',marginRight:'10px',background:'#1E90FF',color:'#fff',fontSize:'3vh'}" @click="redo">重做</u-button>
									<u-button 
										:custom-style="{width:'100rpx',height:'30rpx',borderRadius:'10rpx',background:'#1E90FF',color:'#fff',fontSize:'3vh'}" @click="goBack">返回</u-button>
								</view>
							<view class="writeBox" id="writeBox" v-if="picIndex==1"
								:style="{left:writeBoxLeft,top:writeBoxTop,width:'auto',height:'auto'}">
								<image src="https://www.xfzsb.com/static/image/open.png" mode="widthFix"
									style="width:20px" @tap="showDialog"></image>
							</view>
							<view class="writeBox" v-if="picIndex==3" id="timeBox"
								:style="{left:380*widthBl+'px',top:90*heightBl+'px',width:215*widthBl+'px',height:75*heightBl+'px'}"
								style="text-align: center;">
								<text style="color:red">{{showTime}}</text>
							</view>
							<view class="writeBox" id="writeBox2" v-if="picIndex==1"
								:style="{left:710*widthBl+'px',top:writeBoxTop,width:'auto',height:'auto'}">
								<image src="https://www.xfzsb.com/static/image/open.png" mode="widthFix"
									style="width:20px" @tap="showDialog2"></image>
							</view>
							<view class="writeBox" id="writeBox3" v-if="picIndex!=1&&picIndex!=94"
								:style="{right:100*widthBl+'px',top:30*heightBl+'px'}">
								<image src="https://www.xfzsb.com/static/image/close.png" mode="widthFix"
									style="width:20px" @tap="closePic"></image>
							</view>
							<view class="writeBox" v-if="picIndex==3"
								:style="{left:750*widthBl+'px',top:655*heightBl+'px',width:'auto',height:'auto'}">
								<image src="https://www.xfzsb.com/static/image/open.png" mode="widthFix"
									style="width:20px" @tap="openPrint"></image>
							</view>
							<view class="handleBySelf handleAction"
								:style="{width:80*widthBl+'px',height:40*heightBl+'px',left:1616*widthBl+'px',top:470*heightBl+'px'}"
								@tap="handleBySelfFlag=!handleBySelfFlag" v-if="picIndex==3">

							</view>
							<view class="printBox"
								:style="{padding:'0 '+20*widthBl+'px 0',position:'absolute',left:625*widthBl+'px',bottom:320*heightBl+'px',fontSize:'2vh',background:'#fff',color:'#000',minHeight:500*heightBl+'px',minWidth:300*widthBl+'px'}"
								v-if="picIndex==3&&printOpen">
								<view style="text-align: right;">
									<image src="https://www.xfzsb.com/static/image/close.png" mode="widthFix"
										:style="{width:20+'px'}" @tap="printOpen=false"></image>
								</view>
								<view class="">
									<view class="">
										{{showDate}}
									</view>
									<view class="">
										{{showQuestion==1?'消防水泵':'排烟风机'}} 启动
									</view>
								</view>
								<view class="" v-if="isReturnFlag">
									<view class="">
										{{showDate}}
									</view>
									<view class="">
										{{showQuestion==1?'消防水泵':'排烟风机'}} 已反馈
									</view>
								</view>
								<view class="" v-else>
									<view class="">
										{{showDate}}
									</view>
									<view class="">
										{{showQuestion==1?'消防水泵':'排烟风机'}} 未反馈
									</view>
								</view>
							</view>
							<view class="handleAction" v-if="picIndex==2"
								:style="{width:80*widthBl+'px',height:80*heightBl+'px',left:460*widthBl+'px',top:695*heightBl+'px'}"
								@tap="changeFlag()">

							</view>
							<view class="openBox"
								:style="{width:50*widthBl+'px',height:30*heightBl+'px',left:(showQuestion==1?610:915)*widthBl+'px',top:790*heightBl+'px'}"
								@tap="openedFun" v-if="canOpen">

							</view>
							<view class="writeBox" v-if="picIndex==3&&opened"
								:style="{left:1130*widthBl+'px',top:470*heightBl+'px',width:85*widthBl+'px',height:40*heightBl+'px'}"
								@tap="F2Flag=true"></view>
							<view class="writeBox" v-if="picIndex==3&&opened"
								:style="{left:1520*widthBl+'px',top:470*heightBl+'px',width:85*widthBl+'px',height:40*heightBl+'px'}"
								@tap="changeF6"></view>
							<view class="showInfoBox" v-if="opened&&picIndex==3" id="showInfoBox"
								:style="{left:showInfoBox.left,top:showInfoBox.top,width:510*widthBl+'px',}">
								<view class="" style="color:#fff" :style="{height:30*heightBl+'px'}" v-if="!F6Flag">
									启动信息
								</view>
								<view class="" style="color:#fff" :style="{height:30*heightBl+'px'}" v-if="F6Flag">
									反馈信息
								</view>
								<view class="" style="display: flex;">
									<view class=""
										:style="{width:350*widthBl+'px',textAlign:'center',height:200*heightBl+'px'}"
										style="display: flex;flex-direction: column;justify-content: flex-start;">
										<view class="" style="text-align:left">
											<text v-if="!F6Flag">首警：{{showDate}}
												{{showQuestion==1?'消防水泵':'排烟风机'}}启动</text>
											<text v-if="F6Flag&&isReturnFlag">首警：{{showDate}}
												{{showQuestion==1?'消防水泵':'排烟风机'}} 已反馈</text>
												<text v-if="F6Flag&&!isReturnFlag">首警：{{showDate}}
													{{showQuestion==1?'消防水泵':'排烟风机'}} 未反馈</text>
											<!-- 首警：{{showDate}} {{showQuestion==1?'消防水泵':'排烟风机'}} {{F6Flag?'已反馈':'启动'}} -->
										</view>

									</view>
									<view class=""
										:style="{width:150*widthBl+'px',height:200*heightBl+'px',padding:10*widthBl+'px',boxSizing:'border-box',paddingBottom:0}"
										style="display:flex;flex-direction:column;justify-content: space-between;">
										<view class="" :style="{height:80*heightBl+'px',height:200*heightBl+'px'}">
											<view class="">
												正常 运行
											</view>
											<view class="">
												手动： {{handleBySelfFlag?'允许':'禁止'}}
											</view>
											<view class="">
												自动：允许
											</view>
										</view>
										<view class="" id="timechangeBox" style="text-align: center;color:#fff"
											:style="{fontSize:'1vh'}">
											<view class="dateInfo">
												{{formatTime(new Date(),'yyyy-MM-dd')}}
											</view>
											<view class="timeInfo">
												{{changedTime}}
											</view>
										</view>
									</view>
								</view>
								<view class="" style="color:#fff" v-if="!F2Flag&&!F6Flag" :style="{fontSize:1.5+'vh'}">
									F1查火警 F2查启动 F3查故障 F4查监管 F5查屏蔽 F6查反馈
								</view>
								<view class="" style="color:#fff" :style="{fontSize:1.5+'vh'}" v-else>
									F1页 001 F2 上一页 F3 下一页 F6退出
								</view>
							</view>
							<view class="showInfoBox" v-if="!opened&&picIndex==3" id="showInfoBox"
								:style="{left:showInfoBox.left,top:showInfoBox.top,width:510*widthBl+'px',}">

								<view class="" style="display: flex;" :style="{paddingTop:30*heightBl+'px'}">
									<view class=""
										:style="{width:350*widthBl+'px',textAlign:'center',height:200*heightBl+'px',}"
										style="display: flex;align-items: center;;justify-content: center;">
										<view class="" style="text-align:left">
											正常运行
										</view>

									</view>
									<view class=""
										:style="{width:150*widthBl+'px',height:200*heightBl+'px',padding:10*widthBl+'px',boxSizing:'border-box',paddingBottom:0,}"
										style="display:flex;flex-direction:column;justify-content: space-between;">
										<view class="" :style="{height:80*heightBl+'px'}">
											<view class="">
												正常 运行
											</view>
											<view class="">
												手动： {{handleBySelfFlag?'允许':'禁止'}}
											</view>
											<view class="">
												自动：允许
											</view>
										</view>
										<view class="" id="timechangeBox" style="text-align: center;color:#fff"
											:style="{fontSize:'1vh'}">
											<view class="dateInfo">
												{{formatTime(new Date(),'yyyy-MM-dd')}}
											</view>
											<view class="timeInfo">
												{{changedTime}}
											</view>
										</view>
									</view>
								</view>
								<view class="" style="color:#fff" :style="{fontSize:1.5+'vh'}" v-if="!F2Flag&&!F6Flag">
									F1查火警 F2查启动 F3查故障 F4查监管 F5查屏蔽 F6查反馈
								</view>
								<view class="" style="color:#fff" :style="{fontSize:1.5+'vh'}" v-else>
									F1页 001 F2 上一页 F3 下一页 F6退出
								</view>
							</view>
							<view class="answerBox" :style="{width:345*widthBl-35+'px'}">
								<view class="answerTit">
									请通过多线盘，手动启动{{showQuestion==1?'消防水泵':'排烟风机'}}
								</view>
								<view class="answerSelect">
									判断联动设备动作情况，选择正确答案
									<radio-group @change="onChange">
										<label class="uni-list-cell uni-list-cell-pd" v-for="item in items"
											:key="item.value"
											style="display: flex;margin-bottom: 5px;align-items: center;">
											<view>
												<radio :value="item.value" :checked="result==item.value"
													:style="{transform:'scale('+heightBl+')'}" />
											</view>
											<view>{{item.name}}</view>
										</label>
									</radio-group>
								</view>
							</view>
							<view class="colorIcon"
								:style="{left:widthBl*(showQuestion==1?630:930)+'px',top:685*heightBl+'px'}"
								v-if="opened&&picIndex==2">
								<view class="circle" :style="{width:24*widthBl+'px',height:24*heightBl+'px'}">

								</view>
								<view class="circle" v-if="isReturnFlag"
									:style="{width:24*widthBl+'px',height:24*heightBl+'px',marginTop:10*heightBl+'px'}">

								</view>
							</view>
						</view>

					</view>

				</view>


				<u-mask :show="showFlag" @click="onClickHide">
					<view class="wrapper" style="display: flex;align-items: center;justify-content: center;height:100%">
						<view class="block"
							style="width:400rpx;padding: 20rpx;box-sizing:border-box;background: #fff;font-size:2vh">
							<view class="overtitle">
								【试题解析】 正确答案
							</view>
							<view class="overtitle">
								{{analysList}}
							</view>
							<view class="overtitle">
								正确答案：启动信号已发出设备{{isReturnFlag?'已反馈':'未反馈'}}
							</view>
						</view>
					</view>
				</u-mask>

			</view>

		</template>
	</sysJk>

</template>

<script>
	import sysJk from '@/components/sysJk.vue'
	import {
		fzQuestion
	} from '@/globalApi/requestApi.js'
	import {
		formatTime
	} from '@/util/index.js'
	const app = getApp();
	const baseUrl = app.globalData.requestUrl;
	export default {
		components: {
			sysJk
		},

		data() {


			return {
				// widthBl:0,
				// heightBl:0,
				isReturnFlag: true,
				showQuestion: 1,
				allScore: 0,
				formatTime,
				showTime: null,
				showDate: null,
				changedTime: null,
				examType: 1,
				handleBySelfFlag: false,
				handleByAutoFlag: true,
				writeBox:{width:0,height:0},
				writeBoxLeft: 0,
				writeBoxTop: 0,
				widthBl: null,
				heightBl: null,
				showFlag: false,
				opened: false,
				canOpen: false,
				printOpen: false,
				showInfoBox: {
					left: 0,
					top: 0
				},
				writeBox2: {
					right: 0,
					top: 0
				},
				result: null,
				requestUrl: baseUrl,
				bUrl: baseUrl + "/static/image/jk/9-1.jpg",
				picIndex: 1,
				F2Flag: false,
				F6Flag: false,
				items: [{
						value: "启动信号已发出设备未反馈",
						name: "启动信号已发出设备未反馈",
					},
					{
						value: "启动信号已发出设备已反馈",
						name: "启动信号已发出设备已反馈",
					},


				],
				analysList: '多线盘是消防设备专线，在多线盘上有专门的钥匙控制，与控制器的手自动允许还是禁止无关，只受多线盘的钥匙控制，但是启动后，控制器是能收到启动反馈信号，所以也需要回去查启动，查反馈'

			}
		},
		onLoad(options) {
			this.isReturnFlag = Math.random() >= 0.5
			console.log(this.isReturnFlag)
			this.examType = options.examType
			// var writeBox = uni.createSelectorQuery().in(this).select('#writeBox')
			// writeBox.boundingClientRect(data => {
			// 	this.writeBox = data
			// }).exec()

		},
		onShow() {
			this.createTime()
		},
		onReady() {
			this.$nextTick(function(){
				this.drawWhiteBox()
			})
		},
		methods: {
			openedFun() {
				this.opened = !this.opened
				if (this.opened) {
					this.showDate = this.formatTime(new Date(), 'yy/MM/dd HH:mm:ss')
				}
			},
			return3() {
				this.bUrl = baseUrl + "/static/image/jk/9-3.jpg"
				this.picIndex = 3
			},
			openPrint() {
				if (this.opened) {
					this.printOpen = true
				}
			},
			createTime() {
				// this.showTime=this.formatTime(new Date(),'yy/MM/dd HH:mm:ss')
				let that = this
				// this.showTime = this.formatTime(new Date(),'HH:mm')
				this.showDate = this.formatTime(new Date(), 'yy/MM/dd HH:mm:ss')
				setInterval(function() {
					that.showTime = that.formatTime(new Date(), 'HH:mm')
					that.changedTime = that.formatTime(new Date(), 'HH:mm:ss')
				}, 1000)
			},
			redo() {
				this.opened = false
				this.canOpen = false
				this.F2Flag = false
				this.F6Flag = false
				this.result = null
				this.bUrl = baseUrl + "/static/image/jk/9-1.jpg"
				this.handleBySelfFlag = false
				this.picIndex = 1
				this.isReturnFlag = Math.random() >= 0.5
				console.log(this.isReturnFlag)
			},
			changeF6() {
				if (this.F2Flag) {
					this.F2Flag = false
					this.F6Flag = false
				} else {
					this.F6Flag = true
				}
			},
			goBack() {
				uni.navigateBack()
			},
			handleData() {
				let that = this
				if (!that.result) {
					uni.showToast({
						title: '请选择答案',
						icon: 'none'
					})
					return
				}
				this.$showModal2({
					title: '确认提交？',
					// content: '这是一个模态弹窗',
					
				}).then(res=>{
							fzQuestion({
								fz_id: that.examId,
								title: '请通过多线盘，手动启动消防水泵，并判断设备启动状态',
								no: '9-1',
								question_type: 1,
								user_answer: that.result,
								answer: '',
								is_correct: that.result == that.items[1].value ? true : false,
								score: that.result == that.items[1].value ? 5 : 0,
								start_time: '',
								end_time: '',
								question_answer: ''
							}).then(res => {
					
								if (res.code == 200) {
									if (that.examType == 1) {
										if (that.showQuestion == 1) {
											that.allScore += (that.result == '启动信号已发出设备' + (that
												.isReturnFlag ? '已反馈' : '未反馈')) ? 5 : 0
											that.showQuestion += 1
											that.redo()
										} else {
											let pages = getCurrentPages()
											let prevPage = pages[pages.length - 2]
											prevPage.$vm.status9 = true
											prevPage.$vm.addScore(that.allScore)
											uni.navigateBack()
										}
									} else {
										that.allScore += (that.result == '启动信号已发出设备' + (that
											.isReturnFlag ? '已反馈' : '未反馈')) ? 5 : 0
										let pages = getCurrentPages()
										let prevPage = pages[pages.length - 2]
										prevPage.$vm.status9 = true
										prevPage.$vm.addScore(that.allScore)
										uni.navigateBack()
									}
					
					
								}
							})
						
				});
			},
			onChange(e) {
				this.result = e.detail.value
			},
			closePic() {
				this.printOpen = false
				this.bUrl = baseUrl + "/static/image/jk/9-1.jpg"
				this.picIndex = 1
			},
			changeFlag(type) {
				if (!this.canOpen) {
					this.bUrl = baseUrl + "/static/image/jk/9-2.jpg"
				} else {
					this.bUrl = baseUrl + "/static/image/jk/8-3.jpg"
					this.opened = false
				}
				this.canOpen = !this.canOpen
				// if(type==1){

				// 	this.handleBySelfFlag = !this.handleBySelfFlag
				// }else{
				// 	this.handleByAutoFlag = !this.handleByAutoFlag
				// }
			},
			showDialog() {
				// this.showFlag = true
				if (this.opened || this.canOpen) {

					this.bUrl = baseUrl + "/static/image/jk/9-2.jpg"
					this.picIndex = 2
				} else {
					this.bUrl = baseUrl + "/static/image/jk/8-3.jpg"
					this.picIndex = 2
				}

			},
			showDialog2() {
				this.bUrl = baseUrl + "/static/image/jk/9-3.jpg"
				this.picIndex = 3
			},
			onClickHide() {
				this.showFlag = false
			},
			drawWhiteBox() {
				let that = this
				var warp = uni.createSelectorQuery().in(this).select('#myCard')
				warp.boundingClientRect(data => {
					var widthBl = data.width / 1920
					var heightBl = data.height / 921
					this.widthBl = widthBl
					this.heightBl = heightBl
					this.writeBox.width = 100 * widthBl + 'px'
					this.writeBoxLeft = 850 * widthBl + 'px'
					this.writeBoxTop = 450 * heightBl + 'px'
					this.writeBox.height = 100 * heightBl + 'px'
					this.showInfoBox.left = 1121 * widthBl + 'px'
					this.showInfoBox.top = 95 * heightBl + 'px'
					this.writeBox2.left = 1000 * widthBl + 'px'
					this.writeBox2.top = 450 * heightBl + 'px'
				}).exec()

				// uni.getSystemInfo({
				// 	success: function(res) {
				// 		console.log(res)
				// 		

				// 	}
				// });
			},
			nextTask() {
				uni.navigateTo({
					url: '../jkG/jkG'
				})
			},
			lastTask() {
				uni.navigateBack()
			}
		}
	}
</script>


<style scoped lang="scss">
	.warp {
		height: 100%;
		box-sizing: border-box;
		position: relative;
		// padding: 22rpx 33rpx 38rpx 36rpx;
		display: flex;
		flex-direction: column;
		justify-content: flex-start;
		align-items: center;
		background: #F6F6F6;

		.handleAction {
			// border:1px solid orange;
			// background:yellow;
			position: absolute;
		}

		.myCard {
			width: 100%;
			height: 100%;
			position: absolute;
			left: 0;
			top: 0;
			// border-radius: 20rpx;
			// overflow: hidden;

			.cardContent {
				// padding: 52rpx 58rpx 37rpx;
				box-sizing: border-box;
				width: 100%;
				height: 100%;
				position: relative;
				color: #fff;


				.taskTit {
					width: 100%;
					text-align: left;
					background: #fff;
					color: #000
				}

				.handleBtn {
					position: fixed;
					left: 30px;
					bottom: 30px
				}

				.btnArea {
					margin-top: 160rpx;
					//margin-left: 150rpx;
					display: flex;
					justify-content: center;
					position: fixed;
					right: 30px;
					bottom: 30px // text-align: center;
				}
			}
		}

		.infoBox {
			width: 100%;
			padding: 14rpx 30rpx;
			margin-top: 33rpx;
			border-radius: 20rpx;
			box-sizing: border-box;
			background: #fff;

			.singleInfo {
				width: 100%;
				box-sizing: border-box;
				padding: 20rpx 0;
				display: flex;
				align-items: center;
				justify-content: space-between;
				border-bottom: 1rpx solid #ccc;

				.info {
					flex: 1;

					.desc {
						font-size: 26rpx;
						font-weight: 400;
						color: #222222;
					}

					.time {
						margin-top: 15rpx;
						font-size: 18rpx;
						font-weight: 400;
						color: #888888;
						display: flex;
						align-items: center;
					}
				}

				.val {
					width: 115rpx;
					height: 40rpx;
					border: 1rpx solid #DA2627;
					border-radius: 40rpx;
					text-align: center;
					font-size: 22rpx;
					font-weight: 400;
					color: #DA2627;
					line-height: 40rpx;
				}
			}
		}

		.writeBox {
			// border:1px solid green;
			width: 100px;
			height: 100px;
			position: absolute;
			display: flex;
			align-items: center;
			justify-content: center;
		}

		.writeBox2 {
			// border:1px solid green;
			width: 100px;
			height: 100px;
			position: absolute
		}

		.answerBox {
			position: absolute;
			left: 35px;
			top: 0%;
			background: #fff;
			color: #000;
			// width:25%;
			font-size: 2vh;

			.answerTit {
				background: orange
			}
		}

		.answerSelect {
			padding: 10px 0;
			box-sizing: border-box;
		}

		.showInfoBox {
			position: absolute;
			// background: #fff;
			color: #000;
			font-size: 1.5vh;
		}

		.colorIcon {
			position: absolute;
			z-index: 99;

			.circle {
				background: red;
				border-radius: 50%;
			}
		}

		.openBox {
			position: absolute;
			// background:yellow
		}
	}
</style>